Button

Description

You can add a button control to a component by clicking on the [Button] option in the Other Controls menu. The guides listed here describe how to make button controls appear and function in the way that you want.

Name
Description
Advanced Button Styling

When they are initially added to a component most buttons are somewhat bland. Changing the text and images on a button control, however, is easy.

Dynamically Changing a Button's Code

You can use the $e.removeGroup() and $e.add() functions to alter the javascript code that happens after a button is clicked. This allows you to create buttons that execute different blocks of code when they are clicked a second or third time, etc. This guide describes how to to do this.

Keeping Buttons in a Pressed State

By default, the buttons that you add to a UX component only remain in their 'pressed' state for as long as you hold down the mouse-button over them. As soon as the mouse-button is released the button will return to its regular unpressed state. Sometimes, however, it is useful to keep a button in its pressed state until something, like a dialog, is closed or some action is run.

Prevent an Event From Firing Twice when a User Double Clicks on a Button

Buttons are frequently tied to a javascript action, such as an Ajax callback, that fires when a user clicks on the button. As users might accidentally click on a button more than once, it is desirable to avoid causing any event bound to the button from firing twice.

Split Buttons

Split buttons are comprised of one button divided into two parts. This arrangement provides users the option of running an action or selecting the action to run.

Getting the Button's JavaScript Object

The Button control has a JavaScript object that you can use to modify the button's appearance and behavior at run-time. Use the {dialog.object}.getControl() method to get the object for a button:

var btnObj = {dialog.object}.getControl("BUTTON_1");

Once you have a pointer to the button, you can change its appearance or behavior.

See A5.Button for a list of methods and properties available for the button object.

See Also